$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'sys/store/list',
        datatype: "json",
        colModel: [
            {label: 'id', name: 'storeId', index: 'store_id', width: 20, key: true},
            {label: '店铺名称', name: 'storeName', index: 'store_name', width: 60},
            {label: '店铺地址', name: 'storeAddress', index: 'store_address', width: 150},
            {label: '店铺电话', name: 'storeTel', index: 'store_tel', width: 80},
            // { label: '店铺介绍', name: 'brandIntroduce', index: 'brand_introduce', width: 80 },
            {label: '电话号码(账号)', name: 'mobile', index: 'mobile', width: 80},
            // { label: '登录密码', name: 'password', index: 'password', width: 80 },
            // { label: '店铺成交订单总金额', name: 'performance', index: 'performance', width: 80 },
            // { label: '店铺成交订单总数', name: 'orderCount', index: 'order_count', width: 80 },
            // { label: '店铺成交订单的客户人数总数', name: 'clientCount', index: 'client_count', width: 80 },
            // {label: '店铺钱包金额', name: 'wallet', index: 'wallet', width: 80},
            // { label: '店铺创建时间', name: 'createTime', index: 'create_time', width: 80 },
            // { label: '店铺背景图片', name: 'backgroundPicture', index: 'background_picture', width: 80 },
            // { label: '店铺当天成交订单收入', name: 'todayOrderIncome', index: 'today_order_income', width: 80 },
            // { label: '店铺当天成交订单数', name: 'todayOrderCount', index: 'today_order_count', width: 80 },
            {label: '店铺星级', name: 'star', index: 'star', width: 30},
            // { label: '店铺平均消费金额', name: 'averageExpend', index: 'average_expend', width: 80 },
            {
                label: '店铺类型', name: 'storeType', index: 'store_type', width: 40
                ,
                formatter: function (value, options, row) {
                    if (value === 1) {
                        return '<span class="label label-success">美发店</span>';
                    }
                    if (value === 2) {
                        return '<span class="label label-primary">美容店</span>';
                    }
                    if (value === 3) {
                        return '<span class="label label-success">美甲店</span>';
                    }
                    if (value === 4) {
                        return '<span class="label label-success">纹身店</span>';
                    } else {
                        return '<span class="label label-success">未知</span>';
                    }
                }
            }
            // {label: '店铺账号状态，0:未删除，1:已删除', name: 'deleteType', index: 'delete_type', width: 80},
            // {label: '所在城市id', name: 'cityId', index: 'city_id', width: 80},
            // {label: '所在城市name', name: 'cityName', index: 'city_name', width: 80},
            // {label: '经度', name: 'lgt', index: 'lgt', width: 80},
            // {label: '纬度', name: 'lit', index: 'lit', width: 80},
            // {label: '用户类型 1用户 2技师 3店铺', name: 'userType', index: 'user_type', width: 80},
            // {label: '不工作的那一天 1-7 表示周一至周日 逗号隔开', name: 'noWorkDay', index: 'no_work_day', width: 80},
            // {label: '每天的上班时间', name: 'startWorkTime', index: 'start_work_time', width: 80},
            // {label: '每天的下班时间', name: 'endWorkTime', index: 'end_work_time', width: 80}
        ],
        viewrecords: true,
        height: 385,
        rowNum: 10,
        rowList: [10, 30, 50],
        rownumbers: true,
        rownumWidth: 25,
        autowidth: true,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader: {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames: {
            page: "page",
            rows: "limit",
            order: "order"
        },
        gridComplete: function () {
            //隐藏grid底部滚动条
            $("#jqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
        }
    });
});

var vm = new Vue({
    el: '#rrapp',
    data: {
        showList: true,
        title: null,
        q: {
            storeName: null
        },
        store: {
            lng: null,
            lit: null,
            backgroundPicture: null
        },
        bannercache: ""
    },
    methods: {
        changeImage: function (e) {
            var file = e.target.files[0]
            var reader = new FileReader()
            var THIS = this
            reader.readAsDataURL(file)
            reader.onload = function (e) {
                // this.result 为图片
                THIS.upload(this.result)
            }
        },
        upload: function (data) {
            // 上传图片
            var THIS = this;
            if (this.$refs.file.files.length !== 0) {
                var image = new FormData()
                image.append('file', this.$refs.file.files[0])

                $.ajax({
                    url: '/ge/uploadimage3',
                    // url: '/ge/api/fileUpload/uploadimage3File',
                    data: image,
                    // headers: {
                    //     "Content-Type": "multipart/form-data"
                    // },
                    cache: false,
                    processData: false,
                    contentType: false,
                    type: 'post',
                    success: function (result) {
                        console.info(result.address);
                        THIS.store.backgroundPicture = "[" + '"' + result.address + '"' + "]";
                        THIS.bannercache = result.address;
                    },
                    error: function (error) {
                        alert('图片上传失败!');
                    }
                })
            }
        },
        query: function () {
            vm.reload();
        },
        add: function () {
            vm.showList = false;
            vm.title = "新增";
            vm.store = {
                lng: null,
                lit: null
            };
        },
        update: function (event) {
            var storeId = getSelectedRow();
            if (storeId == null) {
                return;
            }
            vm.showList = false;
            vm.title = "修改";

            vm.getInfo(storeId)
        },
        saveOrUpdate: function (event) {
            var url = vm.store.storeId == null ? "sys/store/save" : "sys/store/update";
            $.ajax({
                type: "POST",
                url: baseURL + url,
                contentType: "application/json",
                data: JSON.stringify(vm.store),
                success: function (r) {
                    if (r.code === 0) {
                        alert('操作成功', function (index) {
                            vm.reload();
                        });
                    } else {
                        alert(r.msg);
                    }
                }
            });
        },
        del: function (event) {
            var storeIds = getSelectedRows();
            if (storeIds == null) {
                return;
            }

            confirm('确定要删除选中的记录？', function () {
                $.ajax({
                    type: "POST",
                    url: baseURL + "sys/store/delete",
                    contentType: "application/json",
                    data: JSON.stringify(storeIds),
                    success: function (r) {
                        if (r.code == 0) {
                            alert('操作成功', function (index) {
                                $("#jqGrid").trigger("reloadGrid");
                            });
                        } else {
                            alert(r.msg);
                        }
                    }
                });
            });
        },
        getInfo: function (storeId) {
            $.get(baseURL + "sys/store/info/" + storeId, function (r) {
                vm.store = r.store;
            });
        },
        reload: function (event) {
            vm.showList = true;
            var page = $("#jqGrid").jqGrid('getGridParam', 'page');
            $("#jqGrid").jqGrid('setGridParam', {
                postData: {
                    'storeName': vm.q.storeName
                },
                page: page
            }).trigger("reloadGrid");
        }
    }
});